<section class="content-header">
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
        <li><a href="#">快递信息管理</a></li>
        <li class="active">快递信息</li>
    </ol>
</section>
<!-- Main content -->
<section class="content">
    <div class="jax-box">
        <form id="formSearch" class="form-horizontal form-search">
            <div class="form-group">
                <div class="col-md-4 col-sm-6">
                    <label class="control-label  col-xs-4" for="userName">用户名:</label>
                    <div class="col-xs-8">
                        <input type="text" class="form-control" id="userName">
                    </div>
                </div>
                <div class="col-md-4 col-sm-6">
                    <label class="control-label  col-xs-4">收件人电话:</label>
                    <div class="col-xs-8">
                        <input type="text" class="form-control" id="phone">
                    </div>
                </div>
                <shiro:hasPermission name="kuaidi:list">
                    <div class="col-md-1 col-sm-6 " style="text-align:left;">
                        <button type="button" id="btn_query" class="btn btn-info">查询</button>
                    </div>
                </shiro:hasPermission>
            </div>
        </form>
    </div>
    <div class="jax-box jax-box-table">
        <div id="toolbar" class="btn-group">
            <shiro:hasPermission name="kuaidi:add">
            <button id="btn_add" type="button" class="btn btn-primary" data-toggle="modal" data-target="#kuaidModal">
                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增
            </button>
            </shiro:hasPermission>
            <shiro:hasPermission name="kuaidi:batchDelete">
            <button id="btn_batch_delete" type="button" class="btn btn-danger">
                <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>批量删除
            </button>
            </shiro:hasPermission>
            <shiro:hasPermission name="kuaidi:templateDown">
                <button id="btn_template_down" type="button" class="btn btn-info">
                    <span class="fa fa-send-o" aria-hidden="true"></span>模板下载
                </button>
            </shiro:hasPermission>
            <shiro:hasPermission name="kuaidi:batchImport">
                <button id="btn_batch_import" type="button" class="btn btn-info" data-toggle="modal" data-target="#uploadModal">
                    <span class="fa fa-send-o" aria-hidden="true"></span>批量导入
                </button>
            </shiro:hasPermission>
            <shiro:hasPermission name="kuaidi:batchExport">
                <button id="btn_batch_export" type="button" class="btn btn-info">
                    <span class="fa fa-send-o" aria-hidden="true"></span>批量导出
                </button>
            </shiro:hasPermission>
        </div>
        <table id="table"></table>
    </div>
</section>
<!-- 用户新增模态框 -->
<div id="kuaidModal" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog"  role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">新增快递</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" id="kuaiDiForm">
                    <div class="box-body">
                        <div class="form-group">
                            <label  class="col-sm-3 control-label">快递单号 :</label>
                            <div class="col-sm-8">
                                <input name="kuaiDiNo" class="form-control" placeholder="">
                            </div>
                        </div>
                        <div class="form-group">
                            <label  class="col-sm-3 control-label">用户名 <span style="color: red">*</span>:</label>
                            <div class="col-sm-8">
                                <input  name="userName" class="form-control" min="3" require="必填项"  placeholder="">
                            </div>
                        </div>
                        <div class="form-group">
                            <label  class="col-sm-3 control-label">电话 :</label>
                            <div class="col-sm-8">
                                <input name="phone" class="form-control" placeholder="">
                            </div>
                        </div>
                        <div class="form-group">
                            <label  class="col-sm-3 control-label">快递公司 :</label>
                            <div class="col-sm-8">
                                <select name="company" class="form-control">
                                    <option value="0">请选择</option>
                                    <option value="jd">京东物流</option>
                                    <option value="zhongtong">中通快递</option>
                                    <option value="shentong">申通快递</option>
                                    <option value="yuantong">圆通速递</option>
                                    <option value="huitongkuaidi">百世快递</option>
                                    <option value="yunda">韵达快递</option>
                                    <option value="shunfeng">顺丰速运</option>
                                    <option value="tiantian">天天快递</option>
                                    <option value="youzhengguonei">邮政快递包裹</option>
                                    <option value="debangwuliu">德邦</option>
                                </select>
                            </div>

                        </div>
                    </div>
                    <div class="box-footer">
                        <div class="pull-right">
                            <button type="button" id="saveKuaiDi" class="btn btn-info">确定</button>
                            <button type="button" data-dismiss="modal" class="btn btn-default">取消</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<!-- 用户详情模态框 -->
<div id="kuaidiDetailModal" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">快递信息</h4>
            </div>
            <div class="modal-body">
                <div id="kuaidiOpenWindow">
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 快递订单详情模态框 -->
<div id="kuaidiShowModal" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">快递信息</h4>
            </div>
            <div class="modal-body">
                <div id="kuaidiShowWindow">
                    <div id="kuadiShowDetail"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="uploadModal" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog"  role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">批量导入</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" id="uploadForm" enctype ="multipart/form-data">
                    <div class="box-body">
                        <div class="form-group">
                            <label  class="col-sm-3 control-label">格式为xls :</label>
                            <div class="col-sm-8">
                                <input type="file" id="upload_file" name="file" class="form-control" placeholder="">
                            </div>
                        </div>
                    </div>
                    <div class="box-footer">
                        <div class="pull-right">
                            <button type="button" id="uploadKuaiDi" class="btn btn-info">确定</button>
                            <button type="button" data-dismiss="modal" class="btn btn-default">取消</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<script>
    var showFlag = "[[${@perms.hasPerm('kuaidi:show')}]]";
    var editFlag = "[[${@perms.hasPerm('kuaidi:update')}]]";
    var deleteFlag = "[[${@perms.hasPerm('kuaidi:delete')}]]";
    var columns = [
        {checkbox: true },
        {
            field: 'id',
            title: '编号',
            align : "center"
        },{
            field: 'userName',
            title: '收件人姓名',
            align : "center"
        }, {
            field: 'phone',
            title: '收件人电话',
            align : "center"
        },{
            field: 'kuaidiNo',
            title: '快递单号',
            align : "center"
        },{
            field: 'company',
            title: '快递公司',
            align : "center"
        },
        {
            field: 'createTime',
            title: '创建时间',
            align : "center"
        },
        {
            field : 'operation',
            title : '操作',
            align : "center",
            class:'min-width-100',
            formatter : function(value,
                                 row, index) {
                var kuaidNoStr = "'"+ row.kuaidiNo + "'";
                var show = showFlag=="true" ? '<a class="table-btn table-btn-info" onclick="showKuaidi('+kuaidNoStr+')">查看</a>' : '';
                var edit = editFlag=="true" ? '<a class="table-btn table-btn-info" onclick="editKuaidi('+row.id+')">编辑</a>' : '';
                var del = deleteFlag=="true" ? '<a  class="table-btn table-btn-danger" onclick="deleteKuaidi('+row.id+')">删除</a>' : '';
                return show + edit + del;
            }
        }];
    var options={
        id:"#table",
        url: '/kuaidi/getList',
        columns:columns,
        toolbar: '#toolbar',
        showRefresh: true,
        queryParams : queryParams
    }
    Core.initTable(options);

    /*查询参数*/
    function queryParams(params) {
        var temp = { //这里的键的名字和控制器的变量名必须一致，这边改动，控制器也需要改成一样的
            pageNumber: params.pageNumber, // 页码
            pageSize: params.pageSize, // 分页大小
            userName : $("#userName").val(),
            phone : $("#phone").val()
        };
        return temp;
    }
    /*查询快递信息*/
    function showKuaidi(kuaidiNo) {

        $.ajax({
            type:'get',
            url:"/kuaidi_query/show/"+kuaidiNo,
            cache:false,
            dataType:'json',
            success:function(result){
                $("#kuaidiShowModal").modal("show");
                $("#kuadiShowDetail").empty();
                for (var i=0;i< result.data.length;i++){
                    if( i == 0){
                        $("#kuadiShowDetail").append('<li style="list-style: none;line-height: 1.6;"><div style="color: #317ee7;"> '+ result.data[i].ftime + '</div><div class="dot"></div><div style="color: #317ee7;margin-bottom: 10px;"> '+ result.data[i].context +'</div></li>');
                    }else{
                        $("#kuadiShowDetail").append('<li style="list-style: none;line-height: 1.6;"><div style="color: #888;"> '+ result.data[i].ftime + '</div><div class="dot"></div><div style="color: #888;margin-bottom: 10px;"> '+ result.data[i].context +'</div></li>');
                    }
                }
            }
        });
    }
    /*编辑*/
    function editKuaidi(id) {
        // window.location.href="#kuaidi/edit?id="+id
        Core.load("#kuaidiOpenWindow","/kuaidi/edit?id="+id,function(){
            $("#kuaidiDetailModal").modal("show");
        },2);
    }
    /*删除*/
    function deleteKuaidi(id) {
        Core.confirm("确定删除该快递信息？",function () {
            Core.postAjax("/kuaidi/delKuaiDi",{"id":id},function (data) {
                if(data.status==200){
                    Core.refreshTable("#table");
                }
                layer.msg(data.msg);
            })
        })
    }
    $(function () {
        /*查询*/
        $("#btn_query").click(function(){
            Core.refreshTable("#table");
        });
        /*保存用戶*/
        $("#saveKuaiDi").click(function(){
            if(doValidForm(kuaiDiForm)){
                Core.mask("#saveKuaiDi");
                Core.postAjax("/kuaidi/addKuaiDi",$("#kuaiDiForm").serialize(),function (data) {
                    Core.unmask("#saveKuaiDi");
                    if(data.status==200){
                        $("#kuaidModal").modal("hide");
                        $("#kuaiDiForm")[0].reset();
                        Core.refreshTable("#table")
                    }
                    layer.msg(data.msg);
                })
            };
        });
        /*批量导入*/
        $("#uploadKuaiDi").click(function(){
            if(doValidForm(uploadModal)){
                Core.mask("#uploadKuaiDi");
                var formdata = new FormData();
                var files = $('#upload_file').prop('files');
                formdata.append('file', files[0]);

                $.ajax({
                    type: 'POST',
                    url: "/kuaidi/import",
                    data: formdata,
                    cache: false,
                    processData: false,
                    contentType: false,
                    success: function (data) {
                        Core.unmask("#uploadKuaiDi");
                        if(data.status==200){
                            $("#uploadModal").modal("hide");
                            $("#uploadForm")[0].reset();
                            Core.refreshTable("#table")
                        }
                        layer.msg(data.msg);
                    }
                });
            };
        });
        /*新增*/
        $("#btn_add").click(function(){
            Core.clearError("#btn_add");
        });
        /*批量删除*/
        $("#btn_batch_delete").click(function(){
            var checkedRows= Core.selectMutiData("#table");
            if(checkedRows){
                Core.confirm("确定删除选中的"+checkedRows.length+"条记录？",function () {
                    var ids=[];
                    $.each(checkedRows, function (i, item) {
                        ids.push(item.id);
                    })
                    Core.postAjax("/kuaidi/batch/delete", {"ids": ids}, function (data) {
                        if (data.status == 200) {
                            Core.refreshTable("#table");
                        }
                        layer.msg(data.msg);
                    })
                })
            }
        });
        /*模板下载*/
        $("#btn_template_down").click(function(){
            window.location.href = "/kuaidi/template/download";
        });
        /*批量导出*/
        $("#btn_batch_export").click(function(){
            var userName = $("#userName").val();
            var phone = $("#phone").val();
            window.location.href = "/kuaidi/export?userName=" + userName + "&phone=" + phone;
            //var checkedRows= Core.selectMutiData("#table");
            // if(checkedRows){
                // Core.confirm("确定导出选中的"+checkedRows.length+"条记录？",function () {
                //     var ids=[];
                //     $.each(checkedRows, function (i, item) {
                //         ids.push(item.id);
                //     })
                //
                //     // Core.postAjax("/kuaidi/export", {"ids": ids}, function (data) {
                //     //     layer.msg('数据导出成功');
                //     //
                //     // })
                // })
            // }
        });

    });

</script>